<template>
    <div class='goodwrap'>
        <ol>
             <li v-for='(item,index) in 6' :key='index'>
                <img :src="img10" alt="">
                <p >香喷喷的炸鸡，不同一香喷喷的炸鸡，不同一香喷喷的炸鸡，不同一</p>
                <div>
                <img :src="tag" alt="">
                美食 |
                <img :src="eye" alt="" class='eye'>
                2357
                </div>
            </li>
        </ol>
    </div>
</template>

<script>
import BScroll from 'better-scroll'
import img10 from '@/assets/imgindex/4.png'
import tag from '@/assets/imgindex/tag.png'
import eye from '@/assets/imgindex/eye.png'
export default {
    data() {
        return {
            tag,
            eye,
            img10
        }
    },
    mounted(){
         let bScroll = new BScroll('.goodwrap', { 
                    //*************************         
                    click: true,         
                    scrollX:true,
                    scrollY:false
        })  
    },
}
</script>

<style lang='stylus'>
    .goodwrap{
        width 100%
        ol{
                display: inline-flex; 
                overflow hidden
                li{
                    display flex
                    flex-direction column
                    margin-left 5px
                    img{
                        width 170px
                        height 108px
                    }
                    p{
                        margin-top 9px
                        font-size: 13px;
                        font-family: PingFang SC;
                        font-weight: bold;
                        color: #666666;
                        text-indent 5px
                        width 135px
                        overflow hidden
                        text-overflow ellipsis
                        white-space nowrap
                    }
                    div{
                        margin-top 9px
                        display flex
                        align-items center
                        font-size: 10px;
                        font-family: PingFang SC;
                        font-weight: 500;
                        color: #666666;
                        img{
                            width 8px
                            height 9px
                            margin-right 7px
                            margin-left 7px
                        }
                        .eye{
                            width 12px
                            height 9px
                        }

                    }
                    
                }
                li:nth-child(1){
                    margin-left 11px
                }
            }
    }
</style>